<template>
  <div class='discount-detail first-box'>
    <Swiper :imgData="imgData"></Swiper>
    <Form :data="info" ></Form>
    <Notice :time="restTime"></Notice>
    <Btn class="margin15" :buttonData="buttonData"></Btn>
  </div>
</template>
<script>
import Swiper from './common/swiper.vue'
import Form from './common/form'
import Notice from './common/notice'
import Btn from '../../common/button.vue'
export default {
  components: {Swiper,Form,Notice,Btn},
  name: "",
  data() {
    return {
      imgData:null,
      info:{
        title:"我是大标题",
        fee:"30",//报名费用
        data:"2018-5-10 ~ 2018-10-11",
        people:50,      //已报名人数
        allPeople:60 ,  //可报名总人数
        type:"养车",
        content:"哈哈是的卡",
        time:312345
      },

      restTime:"312345",

      buttonData:[
        {
          label:"报名",
          click:this.save,
        },{
          label:"取消",
          click:this.cancel,
        }
      ]
    };
  },
  methods: {
    formatTime(val) {
      var day = Math.floor(val / (3600 * 24));
      var hour = Math.floor((val % (3600 * 24)) / 3600);
      var minute = Math.floor(((val % (3600 * 24)) % 3600) / 60);
      var second = Math.floor(((val % (3600 * 24)) % 3600) % 60);
      return [day,"天",hour,"小时",minute,"分",second,"秒"].join().replace(/\,/g,"")
    },

    // 报名
    save(item){
      var params={
        userId:sessionStorage.getItem("userId"),
        activityId:sessionStorage.getItem("detailId")
      }
      _g.apiPost("activity/signup.do",params).then(res=>{
        _g.toMessage(res)
        if(res.status==0){
          this.$router.go(-1)
        }
      })
    },

    cancel(){
      this.$router.go(-1)
    },
    getList(){
      var params={
        id:_g.getRouterParams(this).id || sessionStorage.getItem("detailId")
      }
      _g.apiPost("activity/selectByPrimaryKey.do",params).then(res=>{
        var info={}
        info.title=res.data.activityTitle
        info.fee=res.data.enrollFee||0
        info.data=new Date(res.data.startDate).toLocaleDateString()+" ~ "+new Date(res.data.endTime).toLocaleDateString()
        info.people=res.data.enrollNum||0
        info.allPeople=res.data.initialEnrollNum||0
        info.content=res.data.information
        info.type=["","养车"][res.data.columnType]||"养车"
        info.time=(res.data.endTime-new Date().getTime())/1000>0?(res.data.endTime-new Date().getTime())/1000:0

        this.$set(this,"info",info)
        this.timeSet=setInterval(()=>{
          this.restTime=this.formatTime(--this.info.time)
          
          if(this.info.time<0){
            _g.toMessage({status:"cancel",msg:"活动已经结束"})
            this.$router.go(-1)
          }
        },1000)
        this.imgData=res.data.picture?res.data.picture.split(";"):null
        // console.log(this.imgData)
      })
    }
  },
  created() {
    this.getList()
  },
  beforeDestroy(){
    clearInterval(this.timeSet)
  }
};
</script>
<style lang="scss" scoped>
.discount-detail {

  .margin15{
    margin: 40px 15px;
  }
}
</style>